<?php $layout = 'app';
$title = '注册 - MyCMS'; ?>

<div style="max-width: 420px; margin: 2rem auto;">
    <div style="background: white; padding: 2rem; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
        <h2 style="text-align: center; margin-bottom: 2rem; color: #333;">注册</h2>

        <form method="post" action="/register">
            <?php echo App\Core\CSRF::field(); ?>

            <div style="margin-bottom: 1.5rem;">
                <label for="username" style="display: block; margin-bottom: 0.5rem; font-weight: 500;">用户名</label>
                <input type="text" id="username" name="username" required
                    style="width: 100%; padding: 0.75rem; border: 1px solid #ddd; border-radius: 4px; font-size: 1rem;"
                    placeholder="请输入用户名">
            </div>

            <div style="margin-bottom: 1.5rem;">
                <label for="email" style="display: block; margin-bottom: 0.5rem; font-weight: 500;">邮箱</label>
                <input type="email" id="email" name="email" required
                    style="width: 100%; padding: 0.75rem; border: 1px solid #ddd; border-radius: 4px; font-size: 1rem;"
                    placeholder="请输入邮箱地址">
            </div>

            <div style="margin-bottom: 1.5rem;">
                <label for="password" style="display: block; margin-bottom: 0.5rem; font-weight: 500;">密码</label>
                <input type="password" id="password" name="password" required
                    style="width: 100%; padding: 0.75rem; border: 1px solid #ddd; border-radius: 4px; font-size: 1rem;"
                    placeholder="请输入密码">
            </div>

            <div style="margin-bottom: 2rem;">
                <label for="password2" style="display: block; margin-bottom: 0.5rem; font-weight: 500;">确认密码</label>
                <input type="password" id="password2" name="password2" required
                    style="width: 100%; padding: 0.75rem; border: 1px solid #ddd; border-radius: 4px; font-size: 1rem;"
                    placeholder="请再次输入密码">
            </div>

            <button type="submit" class="btn" style="width: 100%; margin-bottom: 1rem;">
                注册
            </button>
        </form>

        <div style="text-align: center; padding-top: 1rem; border-top: 1px solid #eee;">
            <p style="color: #666; margin-bottom: 0.5rem;">已有账号？</p>
            <a href="/login" style="color: #007bff; text-decoration: none;">立即登录</a>
        </div>
    </div>
</div>